<template>
	<view class="bg"></view>
	<u-navbar
	title="邀请记录"
	:autoBack="true"
	:background="{
	background:'transparent'
	}"
	:border-bottom="false"
	titleSize="28rpx" titleColor="#333"
	back-icon-color="#333"
	:isFixed="false"
	/>
	
	<view class="container bgf ml30 mr30 mt20 pl30 pr30 r20">
		<view class="item t-flex between mt30" v-for="item in data" :key="item.id">
			<view class="user t-flex">
				<uv-image :src="$str.avatar(item.avatar)" mode="aspectFill"
				width="80rpx"
				height="80rpx"
				radius="50%"
				></uv-image>
				<view class="ml20">
					<view class="f30 c3 bold mb6">
						{{item.nickname}}
					</view>
					<view class="f24 c9 ">
						{{$time(item.createtime,2)}}
					</view>
				</view>
			</view>
			<view class="status f24 mainC">邀请成功</view>
		</view>
		
		<empty msg="暂无邀请记录" v-if="!data.length"></empty>

	</view>
			<view class="bpad"></view>
	
</template>

<script setup lang="ts">
	import { onLoad,onPullDownRefresh,onReachBottom} from "@dcloudio/uni-app"
	import { usePaging } from "../../lib/ts/util";
	
	let {
		data,
		reload,
		getMore
	} = usePaging('/api/user/CountFx')
	
	onLoad(()=>{
		reload()
	})
	onPullDownRefresh(()=>{
		reload()
	})
	onReachBottom(()=>{
		getMore()
	})

</script>

<style scoped lang="scss">
	.bg{
		width: 100%;
		height: 510rpx;
		background: linear-gradient( 180deg, #FFEDEB 0%, #F8F8F8 100%);
		border-radius: 4rpx;
		position: absolute;
	}
	
	.container{
		position: relative;
		z-index: 2;
		padding-top: 1rpx;
		padding-bottom: 30rpx;
	}
	
	.mb6{
		margin-bottom: 6rpx;
	}
	
	
</style>
